@charset "UTF-8";

.head .head_top .top_t {
	width: 75%;
	height: 50px;
	background-color: rgba(255, 255, 255, 0.1);
	border-radius: 300px;
	position: fixed;
	/*固定定位*/
	right: 12.5%;
	top: 5px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/*1.1*/
.head .head_top .top_t .t_left {
	width: 200px;
	height: 30px;
	margin-left: 20px;
	display: flex;
	position: relative;
}

.head .head_top .top_t .t_left img {
	height: 100%;
}

.head .head_top .top_t .t_left a:last-child {
	height: 20px;
	position: absolute;
	bottom: 0;
	right: 0;
}

/*1.2.1*/
.head .head_top .top_t .t_rigth {
	width: 550px;
	color: #F5F5F5;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.head .head_top .top_t .t_rigth .input {
	margin-right: 20px;
	height: 25px;
	border-radius: 300px;
	position: relative;
}

.head .head_top .top_t .t_rigth .input input {
	width: 200px;
	height: 25px;
	border-radius: 300px;
	border: 0;
}

.head .head_top .top_t .t_rigth .input button {
	width: 60px;
	height: 25px;
	background-color: #FD7E14;
	border-radius: 300px;
	border: 0;
	position: absolute;
	right: -2px;
}

.head .head_top .top_t .t_rigth .t_r1 img:nth-child(1) {
	width: 30px;
	margin-right: 20px;
}

.head .head_top .top_t .t_rigth .t_r1 svg {
	color: #c0bebd;
	margin-right: 20px;
}

.head .head_top .top_t .t_rigth .t_r1 .rad {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-image: url(../img/h1.jpg);
}

/* box   有问题 
			.head .head_top .top_t .t_rigth .t_r1 .vipbox{
				width: 200px;
				height: 200px;
				float: right;
				background-color:rgba(255, 255, 255, 0.6) ;
				border-radius: 5px;
				box-shadow: 0 2px 5px #aaa;
				display: none;			 隐藏 
			}
			.head .head_top .top_t .t_rigth .t_r1 .vipbox:target{
				display: block;	
			}*/
/*1.2.2*/
.head .head_top .top_b {
	width: 100%;
}

.head .head_top .top_b img {
	width: 100%;
}

.head .head_top .top_b .t_b1 {
	width: 10%;
	height: 300px;
	margin: 2px;
	padding: 5px;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.1), rgba(0, 0, 0, 0.5));
	position: absolute;
	top: 12%;
	right: 10%;
}

.head .head_top .top_b .t_b1 ul li {
	text-align: center;
	padding: 6px;
}

.head .head_top .top_b .t_b1 ul li a {
	color: #c0bebd;
	font-weight: 800;
}

.head .head_top .top_b .t_b1 ul li a:hover::after {
	color: #FFF;
	font-size: 10px;
	font-weight: 300;
	content: "幸福无限工作室开业第一单";
}

.head .bot,
.foot .foot_top {
	width: 100%;
	height: 60px;
	/* background-color: #04414D; */
	margin-top: 10px;

}

.head .bot ul,
.foot .foot_top ul {
	display: flex;
	justify-content: space-evenly
}

.head .bot ul li a {
	width: 100px;
	height: 40px;
	line-height: 40px;
	color: #000000;
	text-align: center;
	font-weight: 800;
	padding: 10px;
	border-radius: 300px;
	box-shadow: 0 2px 5px #aaa;
}

.head .bot ul li a:hover {
	color: #FD7E14;
}

.head .bot ul li a:hover img {
	transform: scale(1.1);
}
